<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>护理</title>
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="layui/css/layui.css">
	<link rel="stylesheet" href="css/masking.css">
	<link rel="stylesheet" href="css/PageNumber.css">


</head>
<style>
	body{
		padding: 0px;
		margin: 0px;
	}
	a{
		text-decoration: none;
		list-style: none;
	}
	a:hover{
		text-decoration: none;
		list-style: none;
	}
	a:focus{
		text-decoration: none;
		list-style: none;
	}
	.contain{
		width: 100%;
		height: 100%;
		position: relative;
	}
	.left{
		float: left;
		display: inline-block;
		width: 170px;
		height: 640px;
		top: 0px;
		border-right: 5px solid #C5F5F7;


	}
	.left ul{
		width: 100%;
		list-style: none;
		margin-top: 0px;
		box-sizing: border-box;
	}
	.left ul li{
		/*margin-left: -39px;*/
		width: 99%;
		height: 25px;
		border: 1px solid gray;
		text-align: center;
	}
	.selected {
		background-color: skyblue;
	}

	.left ul li:hover{
		background-color: skyblue;
		cursor: pointer;
	}

	.left .lrom{
		width: 170px;
		height: 30px;
		position: relative;
		background-color: #E7F0FF;

	}
	.left .lrom p{
		width: 100px;
		height: 100%;
		line-height:30px;
		display: inline-block;
	}
	.left .lrom a{
		display: inline-block;
		width: 20px;
		height: 20px;
		margin-left: 10px;
	}
	.left .lrom a:nth-child(2){
		position: absolute;
		top: 6px;
		right: 37px;
	}
	.left .lrom a:nth-child(3){
		position: absolute;
		top: 6px;
		right: 10px;
	}
	.right{

		display: inline-block;
		width: 875px;
		height: 640px;
		border: 1px solid #ccc;
	}
	.right .pp{
		width: 100%;
		height: 30px;
		position: relative;
		background-color: #E7F0FF;
	}
	.right .pp span{
		height: 100%;
		line-height: 30px;
	}
	.right .pp button{
		position: absolute;
		right: 6px;
		top: 4px;
		width: 50px;
	}
	.right .rightTop{
		width: 100%;
		height: 100px;
	}
	table{
		width: 100%;
		height: 50px;

	}
	table td,th{
		text-align: center;
		border: 1px solid gray;
	}
	table input{
		width: 130px;
		height: 20px;
		outline: none;
		border: 0px;
	}
	.right .rightTop table{
		width: 100%;
		height: 50px;

	}
	.right .rightTop table td,th{
		border: 1px solid gray;
	}
	.right .rightTop table input{
		width: 130px;
		height: 20px;
		outline: none;
		border: 0px;
		text-align: center;
	}
	.right .rightTop table td select{
		background-color: transparent;
		border: 0px;
		text-align: center;
	}
	.contain .tt{
		width: 275px;
		height: 280px;
		position: absolute;
		top: 0px;
		right: 0px;
	}
</style>
<body>
<div class="contain" id="contain">
	<div class="left">
		<div class="lrom">
			<p>康复护理类别</p>
			<a class="glyphicon glyphicon-plus" href="javascript:void(0)" onclick="addHlType()"></a>
			<a class="glyphicon glyphicon-pencil" href="javascript:void(0)"></a>
		</div>
		<ul id="uls">
			<li v-for="soctype in soctypes" onclick="showType(this)" :data-tno="soctype.socid">{{soctype.socname}}</li>
		</ul>
	</div>
	<div class="right">
		<div class="pp">
			<span>老人添加护理</span>

		</div>
		<div class="rightTop">
			<table cellpadding="0" cellspacing="0">
				<thead>
				<td>类型</td>
				<td>姓名</td>
				<td>开始时间</td>
				<td>结束时间</td>
				<td>护理人员</td>
				<td>操作</td>
				</thead>
				<tr>
					<td>
						<input type="text" readonly id="ips" />
					</td>
					<td>
						<select class="oldman">

						</select>
					</td>
					<td><input type="date"/>
					</td>
					<td><input type="date"/>
					</td>
					<td>
						<select class="nurse">

						</select>
					</td>
					<td>
						<input type="button" value="提交" onclick="nurPatientRel(this)"/>
					</td>

				</tr>
			</table>
		</div>
		<div class="rightBottom">
			<div class="pp">
				<span>护理记录查看</span>
			</div>
			<table cellpadding="0" cellspacing="0">
				<thead>
				<td>类型</td>
				<td>姓名</td>
				<td>开始时间</td>
				<td>结束时间</td>
				<td>护理人员</td>
				<td>执行状态</td>
				</thead>
				<tr v-for="rel in rels">
					<td>
						{{rel.socname}}
					</td>
					<td>
						{{rel.oname}}
					</td>
					<td>
						{{rel.rstart}}
					</td>
					<td>
						{{rel.rend}}
					</td>
					<td>
						{{rel.nname}}
					</td>
					<td>
						<input type="text" readonly value="正在执行"/>
					</td>

				</tr>
			</table>
			<div class="fy">

				<ul class="pagination fy-nav" id="pagination1">

				</ul>

			</div>
            <div style="height: 40px"></div>
			<div class="secondMiddle">
				<div class="pp">
					<span>护工</span>
					<button onclick="addNurse()">添加</button>
				</div>
				<table class="mainTable" border="0" cellspacing="0" cellpadding="0">
					<thead>
					<tr>
						<th>工号</th>
						<th>护士名</th>
						<th>护士联系方式</th>
						<th>住址</th>
						<th>操作</th>
					</tr>
					</thead>
					<tbody>
					<tr v-for="nurse in nurses">
						<td>{{nurse.nid}}</td>
						<td>{{nurse.nname}}</td>
						<td>{{nurse.ntel}}</td>
						<td>{{nurse.naddr}}</td>
						<td>
                            <a href="#" onclick="updateNurse(this)">修改</a>
                           <!-- <a href="#" onclick="delNurse(this)">删除</a>-->
                        </td>
					</tr>
					</tbody>
				</table>
				<div class="fy">

					<ul class="pagination fy-nav" id="pagination2">

					</ul>

				</div>
			</div>
		</div>
	</div>

	<div class="tt">
		<div class="layui-inline" id="test-n1"></div>
		<div><p>今日执勤人员：</p></div>
	</div>

</div>
<!--提示-->
<div class="tts tts1">
	<form enctype="multipart/form-data" id="myform1" method="post">
		<table class="ttb">
			<tr>

				<td>
					<div>
						护理类型：<input type="text" name="soctype" class="soctype"/>
					</div>
				</td>
				<td>
					<div>
						<!--护理类型：<input type="text" name="soctype" class="soctype"/>-->
					</div>
				</td>
			</tr>

			<tr><td><input type="button" value="提交" class="btn2"/></td>
				<td><input type="button" value="取消" onclick="cancelData()"/></td>
				<td></td>
			</tr>
		</table>
	</form>
</div>
<div class="tts tts2">
    <form id="myform2" method="post">
        <table class="ttb">
            <tr>
                <td>
                    <div>
                        护士工号：<input type="text" name="nid" class="nid" readonly/>
                    </div>
                </td>
                <td>
                    <div>
                        护士名：<input type="text" name="nname" class="nname"/>
                    </div>
                </td>
            </tr> <tr>
                <td>
                    <div>
                        联系方式：<input type="text" name="ntel" class="ntel"/>
                    </div>
                </td>
                <td>
                    <div>
                        住址：<input type="text" name="naddr" class="naddr"/>
                    </div>
                </td>
            </tr>

            <tr>
				<td>
					<input type="button" value="提交" class="btn3"/>
					<input type="button" value="修改" class="btn4"/>
				</td>
                <td><input type="button" value="取消" onclick="cancelData()"/></td>
                <td></td>
            </tr>
        </table>
    </form>
</div>
<div class="mask"></div>
</body>
<script src="js/JQuery2.1.4.js"></script>
<script src="js/vue.js"></script>
<script src="js/axios.js"></script>
<script src="js/qs.js"></script>
<script src="layui/layui.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/hl.js"></script>
</html>